import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:flutter_syt/api/api.dart';
import 'package:flutter_syt/application.dart';
import 'package:flutter_syt/domain/home/share_api.dart';
import 'package:flutter_syt/domain/news/index_able.dart';
import 'package:flutter_syt/domain/news/news_page.dart';
import 'package:flutter_syt/domain/widgets/flow_item.dart';
import 'package:flutter_syt/domain/widgets/network_load_image.dart';
import 'package:flutter_syt/domain/widgets/stupid_tabs.dart';
import 'package:flutter_syt/utils/click_utils.dart';
import 'package:flutter_syt/utils/global_date_time_format.dart';
import 'package:flutter_syt/widgets/normal_grid.dart';
import 'package:yyy_route_annotation/yyy_route_annotation.dart';

class SpecialListPage extends StatefulWidget with IndexAble {
  final int idx;
  final ScrollerTabEntity entity;

  SpecialListPage(this.idx, this.entity);

  @override
  State<StatefulWidget> createState() => SpecialListPageState();

  @override
  int get index => this.idx;
}

class SpecialListPageState extends State<SpecialListPage> {
  NormalGridController controller = NormalGridController();
  var zhLang = true;
  var local =
      appContext.storage.getString("storyLocal") ?? Intl.getCurrentLocale();
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    NewsPage.controller[widget.entity.alias] = controller;
  }

  @override
  Widget build(BuildContext context) {
    if (local.contains('zh')) {
      zhLang = true;
    } else {
      zhLang = false;
    }
    return Container(
      child: NormalGridView<FlowItemEntity>(
        padding: EdgeInsets.symmetric(horizontal: 15, vertical: 15),
        crossAxisCount: widget.entity.showType,
        controller: controller,
        // refreshItemBuilder:
        //     (BuildContext context, String text, RefreshStatus state) {
        //   return Stack(
        //     children: [
        //       Container(
        //         height: 375,
        //         width: double.infinity,
        //         decoration: BoxDecoration(
        //           color: Colors.white,
        //         ),
        //       ),
        //       Positioned(
        //         left: 0,
        //         right: 0,
        //         bottom: 0,
        //         child: Container(
        //           alignment: Alignment.center,
        //           color: Colors.white,
        //           child: Column(
        //             crossAxisAlignment: CrossAxisAlignment.center,
        //             children: [
        //               Image.asset(
        //                 "assets/icons/empty.png",
        //                 width: 34,
        //                 height: 30,
        //               ),
        //               Container(
        //                 padding: EdgeInsets.only(top: 8, bottom: 22),
        //                 child: Text(
        //                   text,
        //                   style: TextStyle(
        //                     color: Colors.black.withOpacity(0.4),
        //                     fontSize: 14,
        //                   ),
        //                 ),
        //               ),
        //             ],
        //           ),
        //         ),
        //       ),
        //     ],
        //   );
        // },
        itemBuilder: (ctx, item, index) {
          return buildItem(item);
        },
        getData: (pageNumber) async {
          if (pageNumber == 1) {
            await fetchNewsBanner();
            setState(() {});
          }
          var lists = await API.shared.article
              .articleList(pageNumber, alias: widget.entity.alias);
          return lists
              .map((e) => FlowItemEntity.create(
                  e.title, e.publish_time, e.thumb, e.linkUrl,
                  width: e.width, height: e.height))
              .toList();
        },
      ),
    );
  }

  Widget buildItem(FlowItemEntity item) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap:
          ClickUtils.debounce(() => RouteManager.push(context, item.linkUrl)),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          AspectRatio(
            aspectRatio: item.width / item.height,
            // child: Container(
            //   decoration: BoxDecoration(
            //     image: NetworkLoadImage.loadNetworkProviderImage(item.imageUrl),
            //     borderRadius: BorderRadius.all(const Radius.circular(12)),
            //   ),
            child: ClipRRect(
              borderRadius: BorderRadius.circular(12),
              child:

                  // ExtendedImage.network(
                  NetworkLoadImage.loadNetworkImage(item.imageUrl,
                      fit: BoxFit.fitWidth, settingMax: true),
            ),
          ),
          // ),
          Container(
            margin: EdgeInsets.only(top: 8),
            child: Text(
              '${item.text}',
              maxLines: 2,
              softWrap: false,
              textAlign: TextAlign.left,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                color: Color(0xff000000),
                fontSize: 16,
                // fontWeight: FontWeight.w300,
                fontFamily: 'PingFang SC',
              ),
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 10),
            child: Text(
              zhLang == true
                  ? formatDate(item.createTime)
                  : enFormatDate(item.createTime),
              maxLines: 1,
              softWrap: false,
              textAlign: TextAlign.left,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                color: Colors.black.withOpacity(0.4),
                fontSize: 11,
              ),
            ),
          ),
        ],
      ),
    );
  }
}
